<template>
  <div class="home">
    <!-- 全屏容器 -->
    <dv-full-screen-container>
      <!-- 首屏加载loading -->
      <dv-loading v-if="loading" class="flex-center">
        <div color-white>数据加载中...</div>
      </dv-loading>
      <div v-else class="flex flex-col h-full">
        <!-- 标题 -->
        <Title />
        <!-- 主体内容 -->
        <MainView class="main" />
        <!-- 底部 -->
        <FootView class="foot" />
      </div>
    </dv-full-screen-container>
  </div>
</template>

<script setup>
let loading = ref(true);

onMounted(() => {
  setTimeout(() => {
    loading.value = false;
  }, 2000);
});
</script>

<style scoped>
.home {
  background-color: #030409;
  color: #fff;
  height: 100vh;
  width: 100vw;
}

#dv-full-screen-container {
  color: white;
  background-image: url("../assets/bg.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.main {
  /* flex: 1; */
}
</style>
